<template>
  <div class="box">
    <router-link to="/danci">
      <b class="iconfont icon-zidian"></b>
      <span class="danci">单词</span>
    </router-link>
    <router-link to="/kecheng">
      <b class="iconfont icon-kechengtixi"></b>
      <span>课程</span>
    </router-link>
    <router-link to="/faxian">
      <b class="iconfont icon-faxianzhinanzhen"></b>
      <span>发现</span>
    </router-link>
    <router-link to="/shangcheng">
      <b class="iconfont icon-shangcheng"></b>
      <span>商城</span>
    </router-link>
    <router-link to="/wo">
      <b class="iconfont icon-wode2"></b>
      <span>我</span>
    </router-link>
  </div>
</template>

<script>
export default {};
</script>

<style  scoped>
.box {
  width: 100%;
  position: fixed;
  bottom: 0rem;
  display: flex;
  border-top: .01rem solid gray;
  height: 0.7rem;
  flex: 1;
  justify-content: space-around;
  text-align: center;
  /* line-height: 0.7rem; */
  background: #FFFFFF;
}
span{
margin-top:.07rem ;
font-size: .17rem;
-webkit-transform:scale(0.833);
}
a {
  margin-top: .07rem;
  display: block;
  /* width: 3.75rem; */
  height: 0.75rem;
  display: flex;
  flex-direction: column;
  color: #9da0ab;
}

.router-link-active{
    color: #2f3045;
}
</style>